<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>

	google.load('visualization', '1', {packages:['corechart','gauge']});
      google.setOnLoadCallback(init);

    	function init() {

	    	$('#LOAD').html('');
    		$('#LOAD').append('<div class="span12"><blockquote>{{Str::title(__("admin.serverload"))}}  &nbsp;<img src="{{asset("/bundles/admin/img/loader.gif")}}"></blockquote><div id="server_loads"></div></div>');
		      			

			$('#spacejump').html('');
			$('#spacejump').append('<div class="accordion" id="accordion"></div>');

      		jQuery.get("extractor",function(data) {
      			var sourcedata = eval ("(" + data + ")"); 

				var load = Array();

				for(n in sourcedata){

					var server = sourcedata[n];
					// $('#server').append('<input type="checkbox" id="serverload'+n+'">&nbsp;<small>' + server.name +'</small>&nbsp;<br/>');
					
					if(server.load){	
						load.push(server.load);
					}
					


					var group = '<div class="accordion-group" id="group'+n+'" ></div>';

					$('#accordion').append(group);

					var head = '<div class="accordion-heading">'
								+'<a class="accordion-toggle" style="text-decoration: none" data-toggle="collapse" data-parent="#accordion" href="#collapse'+n+'">'
								+'<strong>Server '+n+' : '+server.name+'</strong>'
								+'<div class="pull-right"><small><i class="icon-globe"></i>&nbsp;'+server.load.load_uptime+'&nbsp;&nbsp;<i class="icon-user"></i>&nbsp;'+server.load.load_user+'</small></div>'
								+'</a>'
								+'</div>';

					$('#group'+n+'').append(head);

					var collapse = '<div id="collapse'+n+'" class="accordion-body collapse">'
								+'<div class="accordion-inner" >'
								+'<div class="row-fluid" id="container'+n+'"><div class="span3"></div><div class="span9"></div></div>'
								+'</div>'
								+'</div>';

					$('#group'+n+'').append(collapse);

					var sidebar = drawsidebar(n);
					var content = drawcontents(n);

					$('#container'+n+' div.span3').append(sidebar);
					$('#container'+n+' div.span9').append(content);

					drawMem(server.mem,n);
					drawCpu(server.cpu,n);
					drawHDD(server.hdd,n);
					processList(server.proc,n);
					console.log(server.hdd);
					drawDisk(server.diskcap,n);

				}


      			drawServLoad(load);
      			//setInterval(function(){ intervalDta(); },5000);
      		});
			

			jQuery.get("serviceState",function(data) {
  				var sourcedata = eval ("(" + data + ")"); 
  				for(x in sourcedata){
  					serviceList(sourcedata[x],x);
  				}
  			});

    	}

    	function drawsidebar(n){

    		var draw = '<div class="row-fluid" id="SERV'+n+'"><blockquote>{{Str::title(__("admin.servicelist"))}} &nbsp;<img src="{{asset("/bundles/admin/img/loader.gif")}}"></blockquote></div>'
						+'<div class="row-fluid" id="MEM'+n+'"><blockquote>Loading Memory Data &nbsp;<img src="{{asset("/bundles/admin/img/loader.gif")}}"></blockquote></div>'
						+'<div class="row-fluid" id="HDDUSAGE'+n+'"><blockquote>Loading Hard Disk Data &nbsp;<img src="{{asset("/bundles/admin/img/loader.gif")}}"></blockquote></div>';

			return draw;
    		
    	}

    	function drawcontents(n){

    		var draw = '<div class="row-fluid" id="PROC'+n+'"><blockquote>Loading Process List &nbsp;<img src="{{asset("/bundles/admin/img/loader.gif")}}"></blockquote></div>'
					+'<div class="row-fluid" id="CPU'+n+'"><blockquote>Loading CPU Data &nbsp;<img src="{{asset("/bundles/admin/img/loader.gif")}}"></blockquote></div>'
					+'<div class="row-fluid" id="HDD'+n+'"><blockquote>Loading Hard Disk Data &nbsp;<img src="{{asset("/bundles/admin/img/loader.gif")}}"></blockquote></div>';

			return draw;

    	}

    	function serverData(server){

    		var count = server.length;
    		var utc = currentTime();

			var data = Array(utc.toString());

    		for(x in server){
    			var serverd = server[x];
    			var load = parseFloat(parseFloat(serverd.load_one).toFixed(2));
    			data.push(load);

    		}

    		return data;
    	}

    	function serverHeader(server){

			var data = Array('Times');

    		for(x in server){
    			data.push('Server '+(parseInt(x)+1));
    		}

    		return data;
    	}

	    /*
		* draw server load graph
		*
	    */

	    function drawServLoad(server) {

	    	$('#LOAD div.span12').html('');
	    	$('#LOAD div.span12').append('<blockquote>{{Str::title(__("admin.serverload"))}} </blockquote><div id="server_loads"></div>');

			var load = serverData(server);
			var header = serverHeader(server);
			var colorSet = colorRoller();
			
	        var data = new google.visualization.arrayToDataTable([header,load]);

			var options = {
			      colors: colorSet.reverse(),
			      legend:{position:'top'},
			      isHtml:true,
			      lineWidth:2,
			      pointSize:2,
			      chartArea:{left:40,top:30,width:"100%",height:"75%"},
			      animation:{
			        duration: 1000,
			        easing: 'out',
			      },
			      vAxis: {minValue:0, maxValue:2},
			      hAxis: {gridlines:{count:0},logScale:true},

			    };

	        var chart = new google.visualization.AreaChart(document.getElementById('server_loads'));
	        chart.draw(data, options);
	        setInterval(function(){ redrawSerLoad(chart,data,options); },5000);
	    }

	    /*
		* redrawdraw server load graph
		*
	    */

		function redrawSerLoad(chart,data,options){

			var chartData = data;
			var row = chartData.getNumberOfRows();
			var newrow = row;

			if (row > 100) {
				newrow = row - 1;
	      		chartData.removeRow(Math.floor(0));
			}
	      	var rawData = jQuery.getJSON("grabLoad",function(data) {

	      		var sourcedata = eval(data);

	      		var load = serverData(sourcedata);
	      		chartData.insertRows(newrow, [load]);
	      		chart.draw(chartData, options);

	      	});

		}

		/*
		* draw Memory IO gauge
		*
	    */
	    function drawMem(memory,n){

	    	var design = '<blockquote>Memory Utilization &nbsp;</blockquote>'
	    				+'<div class="row-fluid" >'
	    				+'<div class="span10"><div id="memory'+n+'"></div></div>'
	    				+'</div>'
	    				+'<div class="row-fluid" >'
	    				+'<div class="span10"><div id="gauge'+n+'"></div></div>'
	    				+'</div>';

	    	$('#MEM'+n).html('');
	    	$('#MEM'+n).append(design);

	    	var free = parseInt(memory.mem_kbmemfree);
	    	var used = parseInt(memory.mem_kbmemused);
	    	var buffer = parseInt(memory.mem_kbbuffers);
	    	var cached = parseInt(memory.mem_kbcached);

	    	var persent = parseInt(memory.mem_memused);
	    	var colorSet = colorRoller();


	    	var data = google.visualization.arrayToDataTable([
	          ['Status', 'Byte'],
	          ['Free (Byte)', free],
	          ['Used (Byte)', used],
	          ['Buffer (Byte)',  buffer],
	          ['Cached (Byte)', cached]
	        ]);

	        var options = {
	        	colors: colorSet.slice(5,10).sort().reverse(),
	          chartArea:{left:15,top:10,width:"80%",height:"70%"},
	          legend: {position:'bottom'}
	        };

	        var chart = new google.visualization.PieChart(document.getElementById('memory'+n+''));
	        chart.draw(data, options);


	        var gaugeData = google.visualization.arrayToDataTable([
	          ['Label', 'Value'],
	          ['Usage', persent],
	        ]);

	        var gaugeOptions = {
	          width: 100, height: 100,
	          redFrom: 90, redTo: 100,
	          yellowFrom:75, yellowTo: 90,
	          minorTicks: 5
	        };

	        var gaugeChart = new google.visualization.Gauge(document.getElementById('gauge'+n+''));
	        gaugeChart.draw(gaugeData, gaugeOptions);

	       	setInterval(function(){ 
	        	jQuery.get("grabMemory",function(data) { 
		        	var sourcedata = eval("(" + data + ")");

		        	sourcedata = sourcedata[n];
			    	var free = parseInt(sourcedata.mem_kbmemfree);
			    	var used = parseInt(sourcedata.mem_kbmemused);
			    	var buffer = parseInt(sourcedata.mem_kbbuffers);
			    	var cached = parseInt(sourcedata.mem_kbcached);

			    	var persent = parseInt(sourcedata.mem_memused);

			    	var chartdata = google.visualization.arrayToDataTable([
			          ['Status', 'Byte'],
			          ['Free (Byte)', free],
			          ['Used (Byte)', used],
			          ['Buffer (Byte)',  buffer],
			          ['Cached (Byte)', cached]
			        ]);

			    	gaugeData.removeRow(0);
			    	gaugeData.insertRows(0, [['Usage', persent]]);

	        		chart.draw(chartdata, options);
	        		gaugeChart.draw(gaugeData, gaugeOptions);
	      		});
	        },5000);

	    }

		/*
		* draw CPU IO gauge
		*
	    */
	    function drawCpu(data,n){

	    	var design = '<blockquote>CPU Utilization &nbsp;</blockquote>'
	    				+'<div class="row-fluid" >'
	    				+'<div class="span12"><div id="cpuio'+n+'"></div></div>'
	    				+'</div>';
	    	$('#CPU'+n).html('');
	    	$('#CPU'+n).append(design);

    		var user = parseFloat(data.cpu_user);
	    	var system = parseFloat(data.cpu_system);
	    	var nice = parseFloat(data.cpu_nice);
	    	var iowait = parseFloat(data.cpu_iowait);
			var idle = parseFloat(data.cpu_idle);

	        var gaugeData = google.visualization.arrayToDataTable([
	          	['Status', '%Percentage'],
				['User', user],
				['System', system],
				['Idle', idle],
				['IOwait', iowait]
          	]);

	        var gaugeOptions = {
	        	width: 600, height: 200,
	          	redFrom: 90, redTo: 100,
	          	yellowFrom:75, yellowTo: 90,
	          	minorTicks: 5
	        };

	        var gaugeChart = new google.visualization.Gauge(document.getElementById('cpuio'+n));
	        gaugeChart.draw(gaugeData, gaugeOptions);

	       	setInterval(function(){
	        	jQuery.get("grabCpu",function(data) {
      				var sourcedata = eval("(" + data + ")");
      				sourcedata = sourcedata[n];

		    		var user = parseFloat(sourcedata.cpu_user);
			    	var system = parseFloat(sourcedata.cpu_system);
			    	var nice = parseFloat(sourcedata.cpu_nice);
			    	var iowait = parseFloat(sourcedata.cpu_iowait);
			    	var idle = parseFloat(sourcedata.cpu_idle);

			        var gaugeData = google.visualization.arrayToDataTable([
			          	['Status', 'Byte'],
						['User', user],
						['System', system],
						['Idle', idle],
						['Nice',  nice],
						['IOwait', iowait]
		          	]);

	        		gaugeChart.draw(gaugeData, gaugeOptions);
	      		});
	        },5000);

	    }


	    /*
		* draw HDD IO graph
		*
	    */
	    function drawHDD(hddinfo,n){

	    	var design = '<blockquote>Hard Disk Statistik &nbsp;</blockquote>'
	    				+'<div class="row-fluid" >'
	    				+'<div class="span4"><div id="sctvm'+n+'"></div></div>'
	    				+'<div class="span4"><div id="util'+n+'"></div></div>'
	    				+'<div class="span4"><div id="await'+n+'"></div></div>'
	    				+'</div>'
	    				// +'<div class="row-fluid" >'
	    				// +'</div>'
	    				+'<div class="row-fluid" >'
	    				+'<div class="span4"><div id="read'+n+'"></div></div>'
	    				+'<div class="span4"><div id="write'+n+'"></div></div>'
	    				+'<div class="span4"><div id="avgqu'+n+'"></div></div>'
	    				+'</div>';
	    	$('#HDD'+n).html('');
	    	$('#HDD'+n).append(design);

	    	var hddSourceData = hddData(hddinfo);

	    	drawwHDDsvctm(hddSourceData['device'],hddSourceData['svctm'],n);
	    	drawwHDDutil(hddSourceData['device'],hddSourceData['util'],n);
	    	drawwHDDawait(hddSourceData['device'],hddSourceData['await'],n);
	    	drawwHDDread(hddSourceData['device'],hddSourceData['rs'],n);
	    	drawwHDDwrite(hddSourceData['device'],hddSourceData['ws'],n);
	    	drawwHDDavgqu(hddSourceData['device'],hddSourceData['avgqu'],n);

	    }

	    function drawwHDDsvctm(device,svctm,n){

	    	var serNo = parseInt(svctm.length) - 2;
			var colorSet = colorRoller();

			var chartdata = google.visualization.arrayToDataTable([
			          device,
			          svctm
			        ]);

			var serData = Array();

			for (var i=0;i<=serNo;i++)
			{ 
				if(i == (serNo) ){
					serData.push({type: "line",color:'red'})
				}else{

					serData.push({});
				}
			}

			var options = {
			      colors: colorSet,
			      legend:{position:'bottom'},
			      isHtml:true,
			      lineWidth:2,
			      pointSize:2,
			      chartArea:{left:40,top:30,width:"90%",height:"75%"},
			      animation:{
			        duration: 1000,
			        easing: 'out',
			      },
			      vAxis: {title: 'The average service time (svctm)',minValue:0},
			      hAxis: {gridlines:{count:0},logScale:true},
          		  seriesType: "bars",
          		  series: serData

			    };

	        var chart = new google.visualization.ComboChart(document.getElementById('sctvm'+n));
	        chart.draw(chartdata, options);

	        setInterval(function(){
	        	jQuery.get("grabHdd",function(data) {
		        	var sourcedata = eval("(" + data + ")");
	      			var hddSourceData = hddData(sourcedata[n]);
	      			var newValue = hddSourceData['svctm'];
	      			var utc = currentTime();
	      			var row = chartdata.getNumberOfRows();
					var newrow = row;

					if (row > 5) {
						newrow = row - 1;
			      		chartdata.removeRow(Math.floor(0));
					}

					chartdata.insertRows(newrow, [newValue]);
	        		chart.draw(chartdata, options);
	      		});
	        },5000);

	    }


	    function drawwHDDutil(device,util,n){
	    	
	    	var serNo = parseInt(util.length) - 2;
			var colorSet = colorRoller();

			var serData = Array();

			for (var i=0;i<=serNo;i++)
			{ 
				if(i == (serNo) ){
					serData.push({type: "line",color:'red'})
				}else{

					serData.push({});
				}
			}

			var chartdata = google.visualization.arrayToDataTable([
			          device,
			          util
			        ]);

			var options = {
			      colors: colorSet,
			      legend:{position:'bottom'},
			      isHtml:true,
			      lineWidth:2,
			      pointSize:2,
			      chartArea:{left:40,top:30,width:"90%",height:"75%"},
			      animation:{
			        duration: 1000,
			        easing: 'out',
			      },
			      vAxis: {title: 'Percentage of CPU time during which I/O requests(%util)',minValue:0},
			      hAxis: {gridlines:{count:0},logScale:true},
          		  seriesType: "bars",
          		  series: serData

			    };

	        var chart = new google.visualization.ComboChart(document.getElementById('util'+n));
	        chart.draw(chartdata, options);

	        setInterval(function(){
	        	jQuery.get("grabHdd",function(data) {
		        	var sourcedata = eval("(" + data + ")");
		        	// console.log(sourcedata);
	      			var hddSourceData = hddData(sourcedata[n]);
	      			var newValue = hddSourceData['util'];
	      			var utc = currentTime();
					var row = chartdata.getNumberOfRows();
					var newrow = row;

					if (row > 5) {
						newrow = row - 1;
			      		chartdata.removeRow(Math.floor(0));
					}

					chartdata.insertRows(newrow, [newValue]);
	        		chart.draw(chartdata, options);
	      		});
	        },5000);

	    }

	    function drawwHDDread(device,read,n){
	    	
	    	var serNo = parseInt(read.length) - 2;
			
			var serData = Array();
			var colorSet = colorRoller();

			for (var i=0;i<=serNo;i++)
			{ 
				if(i == (serNo) ){
					serData.push({type: "line",color:'red'})
				}else{

					serData.push({});
				}
			}

			var chartdata = google.visualization.arrayToDataTable([
			          device,
			          read
			        ]);

			var options = {
			      colors: colorSet,
			      legend:{position:'bottom'},
			      isHtml:true,
			      lineWidth:2,
			      pointSize:2,
			      chartArea:{left:40,top:30,width:"90%",height:"75%"},
			      animation:{
			        duration: 1000,
			        easing: 'out',
			      },
			      vAxis: {title: 'Read requests per second',minValue:0},
			      hAxis: {gridlines:{count:0},logScale:true},
          		  seriesType: "bars",
          		  series: serData

			    };

	        var chart = new google.visualization.ComboChart(document.getElementById('read'+n));
	        chart.draw(chartdata, options);

	        setInterval(function(){
	        	jQuery.get("grabHdd",function(data) {
		        	var sourcedata = eval("(" + data + ")");
		        	// console.log(sourcedata);
	      			var hddSourceData = hddData(sourcedata[n]);
	      			var newValue = hddSourceData['rs'];
					var row = chartdata.getNumberOfRows();
					var newrow = row;

					if (row > 5) {
						newrow = row - 1;
			      		chartdata.removeRow(Math.floor(0));
					}

					chartdata.insertRows(newrow, [newValue]);
	        		chart.draw(chartdata, options);
	      		});
	        },5000);

	    }

	    function drawwHDDwrite(device,write,n){
	    	
	    	var serNo = parseInt(write.length) - 2;
			
			var serData = Array();
			var colorSet = colorRoller();

			for (var i=0;i<=serNo;i++)
			{ 
				if(i == (serNo) ){
					serData.push({type: "line",color:'red'})
				}else{

					serData.push({});
				}
			}

			var chartdata = google.visualization.arrayToDataTable([
			          device,
			          write
			        ]);

			var options = {
			      colors: colorSet,
			      legend:{position:'bottom'},
			      isHtml:true,
			      lineWidth:2,
			      pointSize:2,
			      chartArea:{left:40,top:30,width:"90%",height:"75%"},
			      animation:{
			        duration: 1000,
			        easing: 'out',
			      },
			      vAxis: {title: 'Write requests per second',minValue:0},
			      hAxis: {gridlines:{count:0},logScale:true},
          		  seriesType: "bars",
          		  series: serData

			    };

	        var chart = new google.visualization.ComboChart(document.getElementById('write'+n));
	        chart.draw(chartdata, options);

	        setInterval(function(){
	        	jQuery.get("grabHdd",function(data) {
		        	var sourcedata = eval("(" + data + ")");
		        	// console.log(sourcedata);
	      			var hddSourceData = hddData(sourcedata[n]);
	      			var newValue = hddSourceData['ws'];
					var row = chartdata.getNumberOfRows();
					var newrow = row;

					if (row > 5) {
						newrow = row - 1;
			      		chartdata.removeRow(Math.floor(0));
					}

					chartdata.insertRows(newrow, [newValue]);
	        		chart.draw(chartdata, options);
	      		});
	        },5000);

	    }

	    function drawwHDDawait(device,await,n){
	    	
	    	var serNo = parseInt(await.length) - 2;
			
			var serData = Array();
			var colorSet = colorRoller();

			for (var i=0;i<=serNo;i++)
			{ 
				if(i == (serNo) ){
					serData.push({type: "line",color:'red'})
				}else{

					serData.push({});
				}
			}

			var chartdata = google.visualization.arrayToDataTable([
			          device,
			          await
			        ]);

			var options = {
			      colors: colorSet,
			      legend:{position:'bottom'},
			      isHtml:true,
			      lineWidth:2,
			      pointSize:2,
			      chartArea:{left:40,top:30,width:"90%",height:"75%"},
			      animation:{
			        duration: 1000,
			        easing: 'out',
			      },
			      vAxis: {title: 'Average time (ms) for I/O requests issued to the device to be served (await)',minValue:0},
			      hAxis: {gridlines:{count:0},logScale:true},
          		  seriesType: "bars",
          		  series: serData

			    };

	        var chart = new google.visualization.ComboChart(document.getElementById('await'+n));
	        chart.draw(chartdata, options);

	        setInterval(function(){
	        	jQuery.get("grabHdd",function(data) {
		        	var sourcedata = eval("(" + data + ")");
	      			var hddSourceData = hddData(sourcedata[n]);
	      			var newValue = hddSourceData['await'];

					var row = chartdata.getNumberOfRows();
					var newrow = row;

					if (row > 5) {
						newrow = row - 1;
			      		chartdata.removeRow(Math.floor(0));
					}

					chartdata.insertRows(newrow, [newValue]);
	        		chart.draw(chartdata, options);
	      		});
	        },5000);

	    }

	    function drawwHDDavgqu(device,avgqu,n){
	    	
	    	var serNo = parseInt(avgqu.length) - 2;
			
			var serData = Array();
			var colorSet = colorRoller();

			for (var i=0;i<=serNo;i++)
			{ 
				if(i == (serNo) ){
					serData.push({type: "line",color:'red'})
				}else{

					serData.push({});
				}
			}

			var chartdata = google.visualization.arrayToDataTable([
			          device,
			          avgqu
			        ]);

			var options = {
			      colors: colorSet,
			      legend:{position:'bottom'},
			      isHtml:true,
			      lineWidth:2,
			      pointSize:2,
			      chartArea:{left:40,top:30,width:"90%",height:"75%"},
			      animation:{
			        duration: 1000,
			        easing: 'out',
			      },
			      vAxis: {title: 'The average queue length of the requests that were issued to the device',minValue:0},
			      hAxis: {gridlines:{count:0},logScale:true},
          		  seriesType: "bars",
          		  series: serData

			    };

	        var chart = new google.visualization.ComboChart(document.getElementById('avgqu'+n));
	        chart.draw(chartdata, options);

	        setInterval(function(){
	        	jQuery.get("grabHdd",function(data) {
		        	var sourcedata = eval("(" + data + ")");
	      			var hddSourceData = hddData(sourcedata[n]);
	      			var newValue = hddSourceData['avgqu'];
					var row = chartdata.getNumberOfRows();
					var newrow = row;

					if (row > 5) {
						newrow = row - 1;
			      		chartdata.removeRow(Math.floor(0));
					}

					chartdata.insertRows(newrow, [newValue]);
	        		chart.draw(chartdata, options);
	      		});
	        },5000);

	    }


	    function hddData(hddinfo){

	    	var utc = currentTime();
	    	var hddData =  Array();

    		hddData['device'] = Array('Times');
    		hddData['util'] = Array(utc.toString());
    		hddData['svctm'] = Array(utc.toString());
    		hddData['rs'] = Array(utc.toString());
    		hddData['ws'] = Array(utc.toString());
    		hddData['await'] = Array(utc.toString());
    		hddData['avgqu'] = Array(utc.toString());

    		var averageSvctm =  0.0;
    		var averageUtil =  0.0;
    		var averageRead =  0.0;
    		var averageWrite =  0.0;
    		var averageAwait =  0.0;
    		var averageAvgqu =  0.0;

	    	for (i in hddinfo) {

	    		hddData['device'].push(i);

	    		var info = hddinfo[i];
	    		


	    		for(x in info){
	    			if(x == 'hdd_svctm'){
	    				averageSvctm += parseFloat(parseFloat(hddinfo[i]['hdd_svctm']).toFixed(2));
	    				hddData['svctm'].push(parseFloat(parseFloat(hddinfo[i]['hdd_svctm']).toFixed(2)));
	    			}

	    			if(x == 'hdd_util'){
	    				averageUtil += parseFloat(parseFloat(hddinfo[i]['hdd_util']).toFixed(2));
	    				hddData['util'].push(parseFloat(parseFloat(hddinfo[i]['hdd_util']).toFixed(2)));
	    			}

	    			if(x == 'hdd_rs'){
	    				averageRead += parseFloat(parseFloat(hddinfo[i]['hdd_rs']).toFixed(2));
	    				hddData['rs'].push(parseFloat(parseFloat(hddinfo[i]['hdd_rs']).toFixed(2)));
	    			}

	    			if(x == 'hdd_ws'){
	    				averageWrite += parseFloat(parseFloat(hddinfo[i]['hdd_ws']).toFixed(2));
	    				hddData['ws'].push(parseFloat(parseFloat(hddinfo[i]['hdd_ws']).toFixed(2)));
	    			}

	    			if(x == 'hdd_await'){
	    				averageAwait += parseFloat(parseFloat(hddinfo[i]['hdd_await']).toFixed(2));
	    				hddData['await'].push(parseFloat(parseFloat(hddinfo[i]['hdd_await']).toFixed(2)));
	    			}

	    			if(x == 'hdd_avgqu'){
	    				averageAvgqu += parseFloat(parseFloat(hddinfo[i]['hdd_avgqu']).toFixed(2));
	    				hddData['avgqu'].push(parseFloat(parseFloat(hddinfo[i]['hdd_avgqu']).toFixed(2)));
	    			}
	    		}

	    	
	    	};

	    	hddData['device'].push('Average');
	    	hddData['svctm'].push(parseFloat(parseFloat(averageSvctm/hddData['svctm'].length).toFixed(2)));
	    	hddData['util'].push(parseFloat(parseFloat(averageUtil/hddData['util'].length).toFixed(2)));
	    	hddData['rs'].push(parseFloat(parseFloat(averageRead/hddData['rs'].length).toFixed(2)));
	    	hddData['ws'].push(parseFloat(parseFloat(averageRead/hddData['ws'].length).toFixed(2)));
	    	hddData['await'].push(parseFloat(parseFloat(averageAwait/hddData['await'].length).toFixed(2)));
	    	hddData['avgqu'].push(parseFloat(parseFloat(averageAvgqu/hddData['avgqu'].length).toFixed(2)));

	    	return hddData;

	    }

		/*
		* draw Provcees table
		*
	    */
	    function processList(proc,n){

	    	var design = '<blockquote>Process List &nbsp;</blockquote>';

	    	$('#PROC'+n).html('');
	    	$('#PROC'+n).append(design);

			var table = '<table class="table table-condensed">';

			table += '<tr><th><span style="color:#56A5EC;width:100px"><small>%CPU</small></span></th>'
					+'<th><span style="color:#56A5EC;width:100px"><small>%Memory</small></span></th>'
					+'<th><span style="color:#56A5EC"><small>Process</small></span></th>'
					+'</tr>';

			for(x in proc){

				table += '<tr>';

				var kay = proc[x];

				for(i in kay){
					table += '<td><small>' + kay[i] + '</small></td>';
				}

				table += '</tr>';
				
			}

			table += '</table>';

			$('#PROC'+n).append(table);

	       	setInterval(function(){

	        	jQuery.get("grabProc",function(data) {

      				var sourcedata = eval ("(" + data + ")");
      				sourcedata = sourcedata[n];

					var table = '<tr><th><span style="color:#56A5EC"><small>%CPU</small></span></th>'
							+'<th><span style="color:#56A5EC"><small>%Memory</small></span></th>'
							+'<th><span style="color:#56A5EC"><small>Process</small></span></th>'
							+'</tr>';

					for(x in sourcedata){

						table += '<tr>';

						var kay = sourcedata[x];

						for(i in kay){
							table += '<td><small>' + kay[i] + '</small></td>';
						}

						table += '</tr>';
						
					}

	    			$('#PROC'+n+' table').empty().html(table);

	      		});
	        },5000);

	    }

		/*
		* draw Services table
		*
	    */
	    function serviceList(service,n){

	    	var design = '<blockquote>{{Str::title(__("admin.servicelist"))}} &nbsp;</blockquote>';

	    	$('#SERV'+n).html('');
	    	$('#SERV'+n).append(design);

			var table = '<table class="table table-condensed">';

			table += '<tr><th><span style="color:#56A5EC"><small>{{Str::title(__("admin.service"))}}</small></span></th>'

					+'<th><span style="color:#56A5EC"><small>{{Str::title(__("global.status"))}}</small></span></th>'
					+'</tr>';

			for(x in service){

				table += '<tr>';

				var kay = service[x];

				for(i in kay){
					table += '<td><small>' + kay[i] + '</small></td>';
				}

				table += '</tr>';
				
			}

			table += '</table>';

			$('#SERV'+n).append(table);

	    }


		/*
		* draw Disk capacity
		*
	    */
	    function drawDisk(disk,n){

	    	var design = '<blockquote>Disk Capacity &nbsp;</blockquote>'
	    				+'<div class="row-fluid" >'
	    				+'<div class="span10"><div id="disk'+n+'"></div></div>'
	    				+'</div>';

	    	$('#HDDUSAGE'+n).html('');
	    	$('#HDDUSAGE'+n).append(design);

	    	var free = parseInt(disk.disk_free);
	    	var used = parseInt(disk.disk_total)-parseInt(disk.disk_free);
	    	var colorSet = colorRoller();


	    	var data = google.visualization.arrayToDataTable([
	          	['Status', 'Byte'],
	          	['Free (Byte)', free],
			   	['Used (Byte)', used]
	        ]);

	        var options = {
	        	colors: colorSet.slice(5,10).sort().reverse(),
	          	chartArea:{left:15,top:10,width:"80%",height:"70%"},
	          	is3D:true,
	          	legend: {position:'bottom'}
	        };

	        var chart = new google.visualization.PieChart(document.getElementById('disk'+n+''));
	        chart.draw(data, options);

	       	setInterval(function(){
	        	jQuery.get("grabCapacity",function(data) {
		        	var sourcedata = eval ("(" + data + ")");
		        	sourcedata = sourcedata[n];

			    	var free = parseInt(sourcedata.disk_free);
			    	var used = parseInt(disk.disk_total)-parseInt(disk.disk_free);

			    	var chartdata = google.visualization.arrayToDataTable([
			          ['Status', 'Byte'],
			          ['Free (Byte)', free],
			          ['Used (Byte)', used]
			        ]);

	        		chart.draw(chartdata, options);
	      		});
	        },5000);

	    }


		function intervalDta(){
			jQuery.getJSON("cron.php");
		}


	    function colorRoller(){

	    	var color = Array('#565051','#98AFC7','#737CA1','#2B1B17','#56A5EC','#438D80','#25383C','#728C00','#9DC209','#F2BB66');
	    	return color;
	    }

		function currentTime(){

			var now = new Date();
			var h = (now.getHours() <10)? '0' + now.getHours(): now.getHours();
			var m= (now.getMinutes()<10)? '0' + (now.getMinutes() -1): (now.getMinutes()-1);
			var s= (now.getSeconds()<10)? '0' + now.getSeconds(): now.getSeconds();

			return h+":"+m+":"+s;

		}

</script>